<script src="../../../../../../protects/guangxifupin-front/src/containers/App/index.jsx"></script>
<template>
  <div class="padding-middle">
    <el-card>
      <div slot="header" class="clearfix">
        <span>课程分类列表</span>
        <router-link to="/coursemanagement/addSubject/edit"><el-button style="float: right; padding: 3px 0" type="text">添加科目</el-button></router-link>
      </div>
      <el-table
        :data="items"
        empty-text="暂无数据"
        style="width: 100%">
        <el-table-column
          type="index"
          label="序号"
          width="150"/>
        <el-table-column
          prop="name"
          label="科目名称"/>
        <el-table-column
          prop="courseCategoryName"
          label="课程分类"/>
        <el-table-column
          prop="examType"
          label="考试类型"/>
        <el-table-column
          :formatter="toTime"
          prop="createTime"
          label="添加时间"/>
        <el-table-column
          :formatter="toTime"
          prop="updateTime"
          label="修改时间"/>
        <el-table-column
          label="操作">
          <template slot-scope="scope">
            <!--<el-button type="text" size="small">查看</el-button>-->
            <router-link :to="'/coursemanagement/addSubject/edit/' + scope.row.examType+'/'+scope.row.courseCategoryName +'/' +scope.row.courseCategoryId+ '/' +scope.row.name"><el-button size="small" type="text">编辑</el-button></router-link>
            <el-button type="danger" size="small" plain @click="deleteItem(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination-container">
        <el-pagination :current-page="page" :page-size="10" :total="total" background layout="prev, pager, next" @current-change="changePage"/>
      </div>
    </el-card>
  </div>
</template>

<script>
import axios from 'axios'
import Unix from '@/utils/unix'
export default {
  data() {
    return {
      page: 1,
      total: 0,
      items: []
    }
  },
  mounted() {
    this.queryList()
  },
  methods: {
    queryList() {
      axios.get(`/getCourseSubjectList/${"all"}/${"all"}/${this.page}/${10}`).then(res => {
        if (res.success) {
          this.total=res.total
          this.items=res.data
        }
      })
    },
    toTime(row, column) {
      const date = row[column.property]
      return Unix.unixToTime(date)
    },
    changePage(page) {
      this.page=page
      this.queryList()
    },
    /*
    *   删除特定id行
    * */
    deleteItem(row) {
      if (!confirm('确定删除')) {
        return
      }
      axios.delete(`/delCourseSubject/${row.id}`).then(res => {
        if (res.success) {
          this.page = 1
          this.queryList()
        }
      })
    },
  }
}
</script>

<style lang="scss" scoped>
  .cover {
    width: 100px;
    height: 75px;
    box-shadow: 2px 2px 2px #eee;
  }
</style>
